<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="keywords"  content="editable jquery  tree, ajax, php " />
<meta name="description" content="Editable jquery tree with PHP codes" />
<title>Editable jquery tree with PHP codes</title>
<link rel="stylesheet" type="text/css" href="style.css"/>
<style rel="stylesheet" type="text/css">
body {
	font: normal 13px arial, tahoma, helvetica, sans-serif;
	min-width: 780px;
	min-height: 600px;
	margin: 40px;
	margin-top: 0px;
}
.helpHeader , .header {
	padding: 20px;
	font-size: 28px;
	clear: both;
}
.helpContent, .content  {
	line-height:24px;
	padding-left:25px;
	font-size:16px;
	word-spacing:5px;
}
.header {
	font-size: 30px;
}
</style> 
</head>
<body>
<div id="wrap">
		<div class='section'>
			<div class='header'><b>Editable jquery tree with PHP Codes</b></div>
			<div class='content'><img src="images/help/en/tree.jpg"  style="float:left;"/>
				This software is a tree structure runs at web browsers 
				and completes its function, like add item,
				change name, drag & drop and delete item, 
				by using ajax requests. Items in tree view may be in a database table or
				they may be files or folders in file system.
				PHP and MySQL(if items are set to be in a database table) softwares are needed to make this software run.
											
				This software also uses <a href='http://jquery.com'>jquery javascript framework</a>,
				<a href='http://news.kg/wp-content/uploads/tree/'>simple tree plugin.</a> 
				<br/>
								 
			</div>
		</div>
		<div class='section'>
			<div class='header'>Install</div>
			<div class='content'>	
				Set either 
				<pre>DATABASE_PLATFORM or FILE_SYSTEM_PLATFORM</pre> to 
				<pre>TARGET_PLATFORM</pre> macro 
				in 'includes/config.php' to determine which platform software will run at.<br/><br/>
				for instance:
				<pre>define ("TARGET_PLATFORM", DATABASE_PLATFORM);</pre>
				
				<b>if TARGET_PLATFORM is set to FILE_SYSTEM_PLATFORM</b>, 
				FILE_ROOT macro must be set to full path of root folder address.<br/><br/>
				for instance:
				<pre>define("FILE_ROOT", "/home/mekya/public_html/test");</pre>
				Please make sure that web server user has the right to read and write to the folder
				specified above.
				
				<br/><br/>
				<b>if TARGET_PLATFORM is set to DATABASE_PLATFORM</b>, 							
				Set your database parameters in 'includes/config.php',
				also you can change TREE_TABLE_PREFIX macro whose default value is 'tree'.<br/>
				Then create table according to TREE_TABLE_PREFIX macro 
				<pre>CREATE TABLE  `tree_elements` (
`Id` int(10) unsigned NOT NULL auto_increment,
`name` varchar(45) NOT NULL,
`position` int(10) unsigned NOT NULL default '0',
`ownerEl` int(10) unsigned NOT NULL default '0' COMMENT 'parent',
`slave` binary(1) NOT NULL default '0',
PRIMARY KEY  (`Id`)
) ENGINE=InnoDB DEFAULT CHARSET=utf8 ROW_FORMAT=DYNAMIC;
				</pre>				 
			</div>
		</div>
		<div class='section'>
			<div class='header'>Features</div>
			<div id="helpContent">
				<div class="helpHeader">Add item</div>
				<div class="helpContent"><img src="images/help/en/addElement.jpg"  style="float:left;"/>
					Right click a item to open the menu, then click
					'Add File' or 'Add Folder' to add a child item under the right clicked item	<br />
					<div style="clear:both"><img src="images/help/en/addElementText.jpg"  style="float:left;"/> 
						<img src="images/help/en/elementAdded.jpg"  style="float:left;"/>
						Enter the new item's name into the text field, 
						then press <b>Enter</b> to send an ajax request to server and complete the operation or 
						press <b>Esc</b> to cancel the operation.<br />
					</div>					
				</div>
				
				<div class="helpHeader" >Delete item</div>
				<div class="helpContent"><img src="images/help/en/deleteElement.jpg"  style="float:left;"/>
					<img src="images/help/en/deleteElementLast.jpg"  style="float:left;"/>
					Right click a item to open the menu, then click
					'Delete', it will ask whether you are sure to delete the item,
					if yes is clicked, an ajax request will be send to server to complete the operation
					after process is completed succesfully, an item will be removed from tree.
					Please not to forget that if an item is deleted, all child items beloging to it
					will be deleted recursively.			
				</div>
				
				<div class="helpHeader" >Change the position of an item (Drag & Drop)</div>
					<div class="helpContent"><img src="images/help/en/dragElement.jpg"  style="float:left;"/> 
						<img src="images/help/en/dropElement.jpg"  style="float:left;"/>
						Use drag & drop method to change the position and order of an item.
				</div>		
				
				<div class="helpHeader">Change the name of an item</div>
				<div class="helpContent"><img src="images/help/en/editElement.jpg"  style="float:left;"/>
					Right click a item to open the menu, then click
					'Edit'.
					<div style="clear:both"><img src="images/help/en/addElementText.jpg"  style="float:left;"/> 
						<img src="images/help/en/elementAdded.jpg"  style="float:left;"/>
						Enter the item's new name into the text field, 
						then press <b>Enter</b> to send an ajax request and complete the operation or
						press <b>Esc</b> to cancel the operation.<br />
					</div>	
				</div>			
			</div>
		</div>				
		<div class='section'>
			<div class='header'>Support</div>
			<div class='content'>
				If you need support to modify and use this software,
				We can share all information we have for free,
				so feel free to <a href='mailto:ahmetmermerkaya@gmail.com'>contact us</a>				  								 
			</div>
		</div>
		<div class='section'>
			<div class='header'>License</div>
			<div class='content'>
				This software is free.
				It can be modified and distributed without notification.								 
			</div>
		</div>
		<div class='section'>
			<div class='header'>Disclaimer</div>
			<div class='content'>
				This software guarantees nothing, use it with your own risk.
				No responsilibity is taken for any situation.				 
			</div>
		</div>		
		<div class='section'>
			<div class='header'>Authors</div>
			<div class='content'>
				Ozan Koroglu - <a href='mailto:koroglu.ozan@gmail.com'>koroglu.ozan@gmail.com</a> <br/>
				Ahmet Oguz Mermerkaya - <a href='mailto:ahmetmermerkaya@gmail.com'>ahmetmermekaya@gmail.com</a> 							 				 
			</div>
		</div>			
	</div>				
</body>
</html>
